<!--
 * @Descripttion:
 * @version:
 * @Author: cxguo
 * @Date: 2020-03-10 20:49:27
 * @LastEditors: cxguo
 * @LastEditTime: 2020-11-12 10:02:52
 -->
<template>
  <el-select
    v-model="insideVal"
    remote
    clearable
    v-bind="$attrs"
    @change="onChange"
  >
    <el-option
      v-for="item in optionsData"
      :key="item.value"
      :label="item.label"
      :value="item.value"
    >
      <span>{{ item.label }}</span>
      <span style="color: #8492a6; font-size: 13px">{{ getGuideLabel(item) }}</span>
    </el-option>
  </el-select>
</template>

<script>
import { optionsIncludeGuide, options } from '@/api/bsd/employee.js'
import store from '@/store'

export default {
  components: {},
  props: {
    value: {
      type: String,
      default: null
    },
    /**
     * 是否包含导购
     */
    isIncGuide: {
      type: Boolean,
      default: false
    },
    postMethod: {
      type: Function,
      default: null
    }
  },
  data() {
    return {
      optionsData: [],
      appData: store.getters.appData,
      insideVal: null
    }
  },
  computed: {
  },
  watch: {
    'value': {
      handler(val) {
        this.insideVal = val
      },
      immediate: true
    }
  },
  created() {
    this.getListData(this.isIncGuide)
  },
  mounted() {
  },
  methods: {
    getListData(isIncGuide) {
      let method = null
      if (this.postMethod !== null) {
        method = this.postMethod
      } else {
        method = isIncGuide ? optionsIncludeGuide : options
      }
      method().then(res => {
        if (res.data.flag) {
          const data = res.data.data
          this.optionsData = data
          this.isSetDefault && this.handleDefaultData(data)
        }
      }).catch(err => {
        console.log(err)
      })
    },
    handleDefaultData(optionsData) {
      const { userInfo } = this.appData
      const userId = userInfo.userId
      const defaultData = optionsData.find(item => { return item.value === userId })
      if (defaultData) {
        this.handleCurrentData(optionsData)
      } else {
        const defaultData = optionsData[0]
        const userId = defaultData.value
        this.insideVal = userId
        this.$emit('input', userId)
      }
    },
    handleCurrentData(optionsData) {
      const { userInfo } = this.appData
      const userId = userInfo.userId
      optionsData.forEach(item => {
        if (item.value === userId) {
          this.insideVal = userId
          this.$emit('input', userId)
        }
      })
    },
    getGuideLabel(item) {
      if (item.type === '1') return '(导)'
      return null
    },
    onChange(val) {
      this.$emit('input', val)
    }
  }
}
</script>

<style scoped>

</style>
